<template>
  <BoTable
    :columns="columns"
    :request="_fetchList"
    :row-selection="rowSelection"
    height="auto"
    row-key="id"
  ></BoTable>
</template>

<script setup lang="tsx">
import { computed } from 'vue';
import { useDicts } from '@boeyo/portal';
import { BoTable, BoTableProps } from '@boeyo/ui';
import { fetchDevices } from '../api';

const selectedRowKeys = defineModel('value', { default: undefined });

const { pointId, stationId } = defineProps<{
  pointId: number;
  stationId: string;
}>();

const _fetchList = (params) => {
  return fetchDevices({
    ...params,
    pointId,
    stationId,
  });
};

const { deviceTypeEnum } = useDicts(['device_type']);

const columns = computed<BoTableProps['columns']>(() => {
  return [
    {
      title: '设备编号',
      dataIndex: 'stationId',
      hideInSearch: true,
    },
    {
      title: '设备类型',
      dataIndex: 'type',
      hideInSearch: true,
      valueEnum: {
        ...deviceTypeEnum.value,
      },
    },
    {
      title: '设备型号',
      dataIndex: 'model',
    },
    {
      title: '设备厂商',
      dataIndex: 'manufacturer',
      hideInSearch: true,
    },
    {
      title: '硬件序列号',
      dataIndex: 'deviceCode',
    },
    {
      title: '软件版本',
      dataIndex: 'version',
      hideInSearch: true,
    },
    {
      title: '经度',
      dataIndex: 'longitude',
      hideInSearch: true,
    },
    {
      title: '纬度',
      dataIndex: 'latitude',
      hideInSearch: true,
    },
    {
      title: '高程',
      dataIndex: 'height',
      hideInSearch: true,
    },
  ];
});

const rowSelection = computed<BoTableProps['rowSelection']>(() => {
  return {
    selectedRowKeys: [selectedRowKeys.value],
    hideSelectAll: true,
    onChange(_selectedRowKeys) {
      const result = _selectedRowKeys.length
        ? _selectedRowKeys.pop()
        : undefined;
      selectedRowKeys.value = result;
    },
  };
});
</script>
